<template>
  <div class="search">
    <Card>
      <Form
        ref="searchForm"
        :model="queryParam"
        inline
        :label-width="70"
        class="search-form"
      >
        <Form-item label="订单号" prop="orderSn">
          <Input
            type="text"
            v-model="queryParam.orderSn"
            placeholder="请输入订单号"
            clearable
            style="width: 200px"
          />
        </Form-item>
        <Form-item label="订单类型" prop="orderType">
          <DictSelect
            v-model="queryParam.orderType"
            placeholder="订单类型"
            clearable
            style="width: 200px"
            dictCode="ORDER_TYPE"
          />
        </Form-item>
        
        <Button
          @click="reloadData"
          type="primary"
          icon="ios-search"
          class="search-btn"
          >搜索</Button
        >
        <Button
          @click="reloadData(true)"
          type="primary"
          icon="ios-refresh"
          class="search-btn"
          >重置</Button
        >
      </Form>

      <Table
        :loading="loading"
        border
        :columns="columns"
        :data="dataSource"
        ref="table"
        class="mt_10"
      ></Table>
      <Row type="flex" justify="end" class="mt_10">
        <Page v-bind="pageOption" v-on="pageListener"></Page>
      </Row>
    </Card>
    <!-- <EditModel ref="editModel" @success="reloadData"/>
        <DictdataModal ref="dictdataModal"/> -->
  </div>
</template>

<script>
import { SimpleTableMixins } from "@/mixins/SimpleTableMixins.js";
import { getOrderList } from "@/api/billStatic.js";
import { getDictByKey } from "@/libs/dictStorage";

const get = (value, path, defaultValue) => {
  const segments = path.split(/[\.\[\]]/g);
  let current = value;
  for (const key of segments) {
    if (current === null)
      return defaultValue;
    if (current === void 0)
      return defaultValue;
    const dequoted = key.replace(/['"]/g, "");
    if (dequoted.trim() === "")
      continue;
    current = current[dequoted];
  }
  if (current === void 0)
    return defaultValue;
  return current;
};

export default {
  mixins: [SimpleTableMixins],
  components: {},
  data() {
    let that = this;
    return {
      selectDate: [],
      action: {
        listAction: getOrderList,
      },
      columns: [
        {
          title: "订单号",
          key: "sn",
          minWidth: 240,
          tooltip: true,
        },
        // {
        //   title: "订单来源",
        //   key: "clientType",
        //   width: 120,
        //   render: (h, params) => {
        //     if (params.row.clientType == "H5") {
        //       return h("div", {}, "移动端");
        //     } else if (params.row.clientType == "PC") {
        //       return h("div", {}, "PC端");
        //     } else if (params.row.clientType == "WECHAT_MP") {
        //       return h("div", {}, "小程序端");
        //     } else if (params.row.clientType == "APP") {
        //       return h("div", {}, "移动应用端");
        //     } else {
        //       return h("div", {}, params.row.clientType);
        //     }
        //   },
        // },
        {
          title: "订单类型",
          key: "orderPromotionType",
          width: 120,
          render: (h, params) => {
            let showText = ''
            if (params.row.orderType) {
              showText = getDictByKey(
                "ORDER_TYPE",
                params.row.orderType
              );
            }
            return h("div", [h("tag", {props: { color: "geekblue" }}, showText)]);
          },
        },
        // {
        //   title: "买家名称",
        //   key: "memberName",
        //   minWidth: 130,
        //   tooltip: true,
        // },

        {
          title: "订单销售价格",
          key: "goodsPrice",
          minWidth: 100,
          tooltip: true,
          render: (h, params) => {
            let curData = get(params, "row.detail.order.priceDetailDTO", {})
            return h("priceColorScheme", {
              props: {
                value: curData.goodsPrice,
                color: this.$mainColor,
                unit: "",
              },
            });
          },
        },
        {
          title: "运费",
          key: "freightPrice",
          minWidth: 100,
          tooltip: true,
          render: (h, params) => {
            let curData = get(params, "row.detail.order.priceDetailDTO", {})
            console.log('curData', curData);
            return h("priceColorScheme", {
              props: {
                value: curData.freightPrice,
                color: this.$mainColor,
                unit: "",
              },
            });
          },
        },
        {
          title: "订单支付价",
          key: "flowPrice",
          minWidth: 100,
          tooltip: true,
          render: (h, params) => {
            let curData = get(params, "row.detail.order.priceDetailDTO", {})
            return h("priceColorScheme", {
              props: {
                value: curData.flowPrice,
                color: this.$mainColor,
                unit: "",
              },
            });
          },
        },
        {
          title: "订单成本价",
          key: "costPrice",
          minWidth: 100,
          tooltip: true,
          render: (h, params) => {
            let curData = get(params, "row.detail.order.priceDetailDTO", {})
            return h("priceColorScheme", {
              props: {
                value: curData.costPrice,
                color: this.$mainColor,
                unit: "",
              },
            });
          },
        },
        {
          title: "优惠价",
          key: "costPrice",
          minWidth: 100,
          tooltip: true,
          render: (h, params) => {
            let curData = get(params, "row.detail.order.priceDetailDTO", {})
            let couponPrice = curData.couponPrice ||0
            let discountPrice = curData.discountPrice ||0
            return h("priceColorScheme", {
              props: {
                value: couponPrice + discountPrice,
                color: this.$mainColor,
                unit: "",
              },
            });
          },
        },
        
        {
          title: "订单状态",
          key: "orderStatus",
          minWidth: 100,
          render: (h, params) => {
            if (params.row.orderStatus == "UNPAID") {
              return h("div", [
                h("tag", { props: { color: "magenta" } }, "未付款"),
              ]);
            } else if (params.row.orderStatus == "PAID") {
              return h("div", [
                h("tag", { props: { color: "blue" } }, "已付款"),
              ]);
            } else if (params.row.orderStatus == "UNDELIVERED") {
              return h("div", [
                h("tag", { props: { color: "geekblue" } }, "待发货"),
              ]);
            } else if (params.row.orderStatus == "STAY_PICKED_UP") {
              return h("div", [
                h("tag", { props: { color: "geekblue" } }, "待自提"),
              ]);
            } else if (params.row.orderStatus == "DELIVERED") {
              return h("div", [
                h("tag", { props: { color: "cyan" } }, "已发货"),
              ]);
            } else if (params.row.orderStatus == "COMPLETED") {
              return h("div", [
                h("tag", { props: { color: "green" } }, "已完成"),
              ]);
            } else if (params.row.orderStatus == "TAKE") {
              return h("div", [
                h("tag", { props: { color: "volcano" } }, "待核验"),
              ]);
            } else if (params.row.orderStatus == "CANCELLED") {
              return h("div", [
                h("tag", { props: { color: "red" } }, "已关闭"),
              ]);
            }
          },
        },
        {
          title: "下单时间",
          key: "createTime",
          width: 170,
        },
        {
          title: "操作",
          key: "action",
          align: "center",
          width: 100,
          render: (h, params) => {
            return h(
              "Button",
              {
                props: { type: "info", size: "small" },
                style: { marginRight: "5px" },
                on: {
                  click: () => {
                    this.detail(params.row);
                  },
                },
              },
              "查看"
            );
          },
        },
      ],
    };
  },
  methods: {
    // 跳转详情页面
    detail(v) {
      let sn = v.sn;
      this.$options.filters.customRouterPush({
        name: "order-detail",
        query: { sn: sn },
      });
    },
    // 起止时间从新赋值
    selectDateRange(v) {
      if (v) {
        this.queryParam.startDate = v[0];
        this.queryParam.endDate = v[1];
      }
    },
    showDictData(record) {
      this.$refs.dictdataModal.show(record);
    },
  },
  mounted() {},
};
</script>
